<template>
	<div id="app">
		<keep-alive>
			<router-view v-wechat-title="$route.meta.title" v-if="$route.meta.keepAlive"></router-view>
		</keep-alive>
		<router-view v-wechat-title="$route.meta.title" v-if="!$route.meta.keepAlive"></router-view>
		<transition name="demo">
			<Loading v-if="loadingShow" type="circular"></Loading>
		</transition>
	</div>
</template>
<script>
	import loading from '@/components/loading.vue'

	export default {
		name: 'App',
		provide() {
			return {
				app: this
			}
		},
		data() {
			return {
				loadingShow: false
			}
		},
		components: {
			'Loading': loading
			// 'loadingDot': loadingDot,
		},
		mounted() {
			// this.judgeMentEnv((env) => {
			// 	this.$toast(env)
			// })
			let agent = navigator.userAgent.toLowerCase();
			let iLastTouch = null;
			if (agent.indexOf('iphone') >= 0 || agent.indexOf('ipad') >= 0) {
				document.body.addEventListener('touchend', function (event) {
					let a = new Date().getTime();
					iLastTouch = iLastTouch || a + 1;
					let c = a - iLastTouch;
					if (c < 500 && c > 0) {
						event.preventDefault();
						return false;
					}
					iLastTouch = a;
				}, false);
			};
		},
		methods: {
			showLoading() {
				this.loadingShow = true
			},
			hideLoading() {
				this.loadingShow = false
			},
			judgeMentEnv(callback) {
				let ua = navigator.userAgent.toLowerCase();
				//在微信中打开
				if (ua.match(/MicroMessenger/i) == "micromessenger") {
					//微信环境
					wx.miniProgram.getEnv(function (res) {
						// console.log(res)
						'function' === typeof callback && callback(res.miniprogram ? 'wxmini' : 'wx');
					});
				} else {
					'function' === typeof callback && callback('t');
				}
			},
		}
	}

</script>
<style lang="scss">
	#app {
		width: 100%;
		min-height: 100vh;
		// background: url('../static/img/bg.png');
		background-size: 100% auto;
		background-repeat: repeat-y;
		overflow: hidden;
	}

	/* 自定义颜色 */
	#nprogress .bar {
		background-color: $baseColor !important;
	}

	#nprogress .peg {
		box-shadow: 0 0 10px $baseColor, 0 0 5px $baseColor48;
	}

	.demo-enter-active,
	.demo-leave-active {
		transition: 0.3s ease-out;
	}

	.demo-enter {
		opacity: 0;
	}

	.demo-leave-to {
		opacity: 0;
	}

</style>
